<script>
export default {
  name: 'UiChartLegend',
  inject: ['UiChart'],
  props: {
    data: {
      type: Array
    },
    show: {
      type: Boolean,
      default: true
    }
  },
  computed: {
    seriesData () {
      return this.UiChart.options.series || []
    },
    innerData () {
      if (this.data && this.data.length) {
        return this.data
      }
      return this.seriesData.map(v => v.name).filter(v => !!v)
    }
  },
  watch: {
    innerData () {
      this.UiChart.setOption('legend', {
        show: this.show,
        data: this.innerData
      })
    }
  },
  created () {
    this.UiChart.setOption('legend', {
      show: this.show,
      data: this.innerData
    })
  },
  render () {
    return null
  }
}
</script>
